import { defineStore } from "pinia";
import { ref,watch } from "vue";
import { parse } from "vue/compiler-sfc";

function initState(){
    return {
        isCollapse:true,
        tags:[
    {
        path:'/home',
        name:'home',
        label:'首页',
        icon:'home'
    }
],
        currentMenu:null,
        menuList:[],
        token:"",
        routerList:[],
    };
}
export const useAllDataStore = defineStore('AllData',() => {
    
    const state = ref(initState())

    watch(state,(newObj)=>{
        if(!newObj.token) return
        else{
            localStorage.setItem("store",JSON.stringify(newObj))
        }
    },{deep:true}
)

    function selectMenu(val) {
        if(val.name === 'home'){
            state.value.currentMenu = null;
        }else{
            state.value.currentMenu = val;
            // 检查标签是否已存在
            let index = state.value.tags.findIndex((item) => item.name === val.name);
            index === -1 ? state.value.tags.push(val) : "";
        }
    }
    // 删除标签
    function deleteTags(tag){
        let index = state.value.tags.findIndex((item) => item.name === tag.name)
        state.value.tags.splice(index,1)
    }
    // 更改侧边栏
    function updateMenuList(val){
        state.value.menuList = val;
    }
    // 实现动态路由
    function addMenu(router,type){
        if(type === "refresh"){
            if(JSON.parse(localStorage.getItem('store'))){
                state.value = JSON.parse(localStorage.getItem('store'))
                state.value.routerList = [];
            }else{
                return;
            }
        }
        const menu = state.value.menuList;
        const module = import.meta.glob('../views/**/*.vue')
        const routeArr = []
        menu.forEach((item) => {
            if (item.children) {
                item.children.forEach((val) => {
                    let url = `../views/${val.url}.vue`;
                    val.component = module[url];
                    routeArr.push(...item.children);
                })
            } else {
                let url = `../views/${item.url}.vue`;
                item.component = module[url];
                routeArr.push(item);
            }
        });
        state.value.routerList = [];
        let routers = router.getRoutes()
        routers.forEach((item) => {
            if(item.name == 'main' || item.nanme == 'login'){
                return
            }else{
                router.removeRoute(item)
            }
        })
        routeArr.forEach((item) => {
            state.value.routerList.push(router.addRoute("main",item))
        })
    }
        // 
        function clean(){
            state.value.routerList.forEach((item) => {
                if(item) item();
            });
            state.value = initState();
            localStorage.removeItem('store')
        }
    return { 
        state,
        selectMenu,
        deleteTags,
        updateMenuList,
        addMenu,
        clean,
    }
})